<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Demo介绍</title>

    <style>
        .content{
            display: flex;
            justify-content: center;
            align-items: center;
        }
        li{
            margin-bottom: 40px;
        }

    </style>

    <script type="text/javascript">
        //startPlay开始播放
        function startPlay(url) {
            window.open(url);
        }
    </script>
</head>
<body>
<div class="content">
    <ul>
        <div style="margin-bottom: 30px;">
            注：如下的都是学习鸿蒙开发的视频，仅仅是demo
        </div>
        <li>
            <a href="javascript:;" onclick="startPlay('https://v.douyin.com/iYmVRFPy/')">仿永辉生活App</a>
            <div>
                知识点：练习UI布局，网络数据解析，处理
            </div>
        </li>
        <li>
            <a href="javascript:;" onclick="startPlay('https://v.douyin.com/iYmVWEdG/')">锋盟理财</a>
            <div>
                <p>
                    知识点：端云一体化项目，端侧调用云函数，云侧调用云数据库， 原生请求云端数据 + webview加载本地页面渲染
                <p>
            </div>
        </li>
        <li>
            <a href="javascript:;" onclick="startPlay('https://v.douyin.com/iYmqkqAN/')">黑马健康</a>
            <div>
                <p>
                    知识点：操作本地数据
                </p>
            </div>
        </li>
        <li>
            <a href="javascript:;" onclick="startPlay('https://v.douyin.com/iYmbxb15/')">锋能Charging(充电App)</a>
            <div>
                <p>
                    知识点：华为手机号认证，高德地图使用(web)，端侧直接操作云数据库
                </p>
            </div>
        </li>
        <li>
            <a href="javascript:;" onclick="startPlay('https://v.douyin.com/iYmbtghP/')">易速记(极简便签)</a>
            <div>
                <p>知识点：原子化服务上线流程，本地数据库操作</p>
                <p style="color: #f00; font-weight: bold">注：该原子化服务已经上线华为应用商店，免安装，在负一屏/服务中心搜索易速记即可。</p>
            </div>
        </li>
        <!-- 更多的列表项 -->
    </ul>
</div>


</body>
</html>